<script>
	export default {
		onLaunch: function() {
			console.log('App Launch')
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		}
	}
</script>

<style lang="scss">
	/* 导入SCSS变量文件 */
	@import './uni.scss';
	@import './common/styles.scss';

	/* 导入iconfont */
	@font-face {
		font-family: "iconfont";
		src: url('//at.alicdn.com/t/font_3203035_1cgm1ul36nxe.woff2?t=1645604652091') format('woff2'),
			 url('//at.alicdn.com/t/font_3203035_1cgm1ul36nxe.woff?t=1645604652091') format('woff'),
			 url('//at.alicdn.com/t/font_3203035_1cgm1ul36nxe.ttf?t=1645604652091') format('truetype');
	}

	.iconfont {
		font-family: "iconfont" !important;
		font-size: 16px;
		font-style: normal;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	/* 全局样式 */
	page {
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
		color: $dark-text;
		background-color: #f5f5f5;
		line-height: 1.5;
		font-size: $font-size-base;
	}

	/* 工具类 */
	.flex { display: flex; }
	.flex-col { flex-direction: column; }
	.flex-row { flex-direction: row; }
	.flex-between { justify-content: space-between; }
	.flex-center { justify-content: center; }
	.items-center { align-items: center; }
	.flex-1 { flex: 1; }
	.text-center { text-align: center; }
	.text-primary { color: $primary-color; }
	.text-light { color: $light-text; }
	.mt-1 { margin-top: 10rpx; }
	.mt-2 { margin-top: 20rpx; }
	.mt-3 { margin-top: 30rpx; }
	.mb-1 { margin-bottom: 10rpx; }
	.mb-2 { margin-bottom: 20rpx; }
	.mb-3 { margin-bottom: 30rpx; }
	.ml-1 { margin-left: 10rpx; }
	.mr-1 { margin-right: 10rpx; }
	.p-2 { padding: 20rpx; }
	.p-3 { padding: 30rpx; }

	/* 按钮样式 */
	.btn {
		display: inline-block;
		border: none;
		border-radius: $border-radius-medium;
		padding: 16rpx 32rpx;
		font-size: $font-size-base;
		text-align: center;
		box-sizing: border-box;
	}

	.btn-primary {
		background-color: $primary-color;
		color: #fff;
	}

	.btn-outline {
		background-color: transparent;
		border: 1px solid $border-color;
		color: $light-text;
	}

	.btn-block {
		display: block;
		width: 100%;
	}

	/* 卡片样式 */
	.card {
		background-color: #fff;
		border-radius: $border-radius-medium;
		margin-bottom: 20rpx;
		overflow: hidden;
		box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.05);
	}

	.card-content {
		padding: 24rpx 30rpx;
	}

	/* 标签样式 */
	.badge {
		display: inline-block;
		padding: 6rpx 16rpx;
		border-radius: $border-radius-medium;
		font-size: $font-size-small;
	}

	.badge-success {
		background-color: rgba(7, 193, 96, 0.1);
		color: $success-color;
	}

	.badge-warning {
		background-color: rgba(255, 195, 0, 0.1);
		color: $warning-color;
	}

	.badge-danger {
		background-color: rgba(250, 81, 81, 0.1);
		color: $error-color;
	}

	.badge-info {
		background-color: rgba(0, 122, 255, 0.1);
		color: $info-color;
	}

	/* 页面容器 */
	.page-container {
		padding-bottom: 100rpx;
	}
</style>
